<template>
    <div>
		<Head/>
		<el-row class="myPDrow" type="flex" justify="center" v-loading="loading">
		<el-col :span="11" class="myPDrolleft">
			<LeftPictureShow/>
		</el-col>
		<el-col :span="13" class="myPDrolright">
			<RightChoice/>
		</el-col>
		</el-row>
		<DownShow/>
		<Tail/>
    </div>
</template>

<script>
import Head from '../universalpage/head/XiaoHead.vue'
import Tail from '../universalpage/tail/XiaoTail.vue'
import LeftPictureShow from './XiaoLeftPictureShow.vue'
import RightChoice from './XiaoRightChoice.vue'
import DownShow from './XiaoDownShow.vue'
export default {
    name:'XiaoProductDetails',
	components:{Head,Tail,
				LeftPictureShow,RightChoice,DownShow},
	data(){return{loading:false,}},
	mounted(){
		this.$bus.$on('gobuyloading',(loading)=>{
			this.loading=loading
		})
	},
	beforeDestroy(){
		this.$bus.$off('gobuyloading')
	}
}
</script>

<style scoped>
.myPDrow{
	height: 500px;
	width: 100%;
}
.myPDrolleft{
	height: 100%;
	text-align: center;
}
.myPDrolright{
	height: 100%;
}
</style>